<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>用户中心-思多客</title>
    <link href="http://cdn.bootcss.com/normalize/7.0.0/normalize.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/public/css/m/public.css">
    <link rel="stylesheet" href="/public/css/m/user.css">
</head>

<body>
    <div class="new-header flex">
        <div class="back-box">
            <img src="/public/images/m/back.png" alt="" class="left-back-icon">
        </div>
        <div class="right-icon-flex n-right-flex">
            <a href="javascript:exit();" class="login-out">退出登录</a><a href="/m/update-password.html" class="update-pwd">修改密码</a>
        </div>
    </div>
    <div class="content">
        <div class="usercenter" id="J_userInfo">
            <!-- <div class="flex usercenter-tab">
                    <div class="usercenter-tab-active">我的悬赏</div>
                    <div>我的报告</div>
                </div> -->
        </div>
        <div class="usercenter-dec">
            <h3>我的悬赏</h3>
            <div id="J_reward_content"></div>
            <h3>我的报告</h3>
            <div id="J_report_content"></div>
        </div>
        <div id="footer"></div>
    </div>
</body>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script src="/public/js/m/fontResize.js"></script>
<script src="/public/lib/layer/layui.js"></script>
<script src="/public/js/G.js"></script>
<script src="/public/js/user.js"></script>
<script src="/public/js/reward.js"></script>
<script src="/public/js/productOrder.js"></script>
<script src="/public/js/m/public.js"></script>
<script id="J_reward_tpl" type="text/html">
    {{# if(d.count > 0){ }}
    <ul class="all-reward-box-ul" id="J_reward"></ul>
    {{# if(d.count > d.pageSize){ }}
    <div class="click-load">加载更多</div>
    {{# }; }} {{# }else{ }}
    <div class="center"><img style="width:3.13rem" src="/public/images/m/no_content.png" alt="没有内容"></div>
    {{# }; }}
</script>
<script id="J_reward_item_tpl" type="text/html">
    {{# d.forEach(function(val,index){ }}
    <li class="reward-list" data-id="{{val.rewardId}}" data-user="{{val.userId}}">
        <div class="list-title clearfix">
            <h4 class="list-big-title fl">{{val.title}}</h4>
            <div class="right-small-txt fr">
                <p class="reward-time">{{new Date(val.createTime).format('MM-DD HH:ii')}}
                    <br>{{formatRewardType(val.type)}}</p>
            </div>
        </div>
        <div class="list-user-msg clearfix">
            <img src="/{{G.defaultAvator}}" data-lazyload-img="{{G.uploadurl}}/avator/{{val.userId}}.png" alt="" class="reward-header">
            <span class="reward-username">{{val.createUser.username}}</span>
        </div>
        <p class="dec-box none-border">{{val.content}}</p>
        <div class="look-box">
            <div class="look-all-dec inline-block">{{val.finish == false ? '未完成' : '已完成'}}</div>
            <span class="reward-reports inline-block">{{val.commentsNumber}}条评论</span>
        </div>
    </li>
    {{# }); }}
</script>
<script id="J_report_tpl" type="text/html">
    {{# if(d.count > 0){ }}
    <div class="report-body clearfix" id="J_report"></div>
    {{# if(d.count > d.pageSize){ }}
    <div class="click-load">加载更多</div>
    {{# }; }} {{# }else{ }}
    <div class="center"><img style="width:3.13rem" src="/public/images/m/no_content.png" alt="没有内容"></div>
    {{# }; }}
</script>
<script id="J_report_item_tpl" type="text/html">
    {{# d.forEach(function(val,index){ }}
    <a class="report-item-1 download" href="{{G.apiurl}}api/product/{{val.productId}}/download?token={{G.getCookie('jwt')}}">
        <div class="report-body-bottom clearfix">
            {{val.title}}</div>
        <div class="report-body-top clearfix">
            <h4 class="m-report-teacher-name"></h4>
            <p class="m-publish-time">购买时间:{{new Date(val.payTime).format('MM-DD HH:ii')}}</p>
            <input type="button" value="点击查看" class="report-btn">
        </div>
    </a>
    {{# }); }}
</script>
<script id="J_userInfo_tpl" type="text/html">
    <div class="usercenter-header">
        <img src="/{{G.defaultAvator}}" data-lazyload-img="{{G.uploadurl}}/avator/{{d.userId}}.png" alt="{{d.username}}" class="user-header-img">
    </div>
    <p class="username">{{d.username}},您好! </p>
    <div class="n-look-box">
        <span>赏币余额:{{d.balance}}</span>
        <a href="/m/chargeMoney.html" class="look-all-dec1">充值</a>
        <a href="/m/invite.html" class="invite-code">邀请码</a>
    </div>
    <div class="n-look-box">
        <span>电话:{{formatVal(d.phone)}}</span>
        <span class="m-left-3">邮箱:{{formatVal(d.email)}}</span>
    </div>
</script>
<script>
layui.use('laytpl', function() {
    var laytpl = layui.laytpl;

    var src = location.pathname.slice(3)
    isLogined(src)
    
    var rewardParams = {
        orderRule: 'TIME',
        order: 'DESC',
        pageSize: 5,
        pageId: 1
    }
    var reportParams = {
        payed: true,
        pageSize: 6,
        pageId: 1
    }
    var rewardCounts;
    var reportCounts;
    //我的悬赏
    function renderReward(params, isload) {
        loading.open()
        reward.getMyReward(params, function(data) {
            console.log(data)
            if (isload) {
                if (params.pageId > Math.ceil(data.count / params.pageSize)) {
                    loading.close()
                    return;
                }
                laytpl($('#J_reward_item_tpl').html()).render(data.list, function(html) {
                    $('#J_reward').append(html)
                })
            } else {
                rewardCounts = data.count;
                laytpl($('#J_reward_tpl').html()).render(data, function(html) {
                    $('#J_reward_content').html(html)
                })
                if (data.count > 0) {
                    laytpl($('#J_reward_item_tpl').html()).render(data.list, function(html) {
                        $('#J_reward').html(html)
                    })
                }
            }
            lazyload()
            loading.close()
        }, function(err) {
            loading.close()
            console.log(err)
            // alert(err)
        })
    }
    renderReward(rewardParams, false)
    //我的悬赏加载更多
    $(document).on('click', '#J_reward_content .click-load', function() {
        rewardParams.pageId++;
        if (rewardParams.pageId == Math.ceil(rewardCounts / rewardParams.pageSize)) {
            $(this).hide()
        }
        renderReward(rewardParams, true)
    })

    //我的报告
    function renderReport(params, isload) {
        loading.open();
        productOrder.getList(params, function(data) {
            console.log(data)
            if (isload) {
                if (params.pageId > Math.ceil(data.count / params.pageSize)) {
                    loading.close()
                    return;
                }
                laytpl($('#J_report_item_tpl').html()).render(data.list, function(html) {
                    $('#J_report').append(html)
                })
            } else {
                console.log(2)
                laytpl($('#J_report_tpl').html()).render(data, function(html) {
                    $('#J_report_content').html(html)
                })
                if (data.count > 0) {
                    reportCounts = data.count;
                    laytpl($('#J_report_item_tpl').html()).render(data.list, function(html) {
                        $('#J_report').html(html)
                    })
                }
            }
            lazyload()
            loading.close()
        }, function(err) {
            loading.close()
            console.log(err)
            // alert(err)
        })
    }
    renderReport(reportParams, false)
    //我的报告加载更多
    $(document).on('click', '#J_report_content .click-load', function() {
        reportParams.pageId++;
        if (reportParams.pageId == Math.ceil(reportCounts / reportParams.pageSize)) {
            $(this).hide()
        }
        renderReport(reportParams, true)
    })
    user.getInfo({}, function(data) {
        console.log(data)
        laytpl($('#J_userInfo_tpl').html()).render(data, function(html) {
            $('#J_userInfo').html(html)
        })
        lazyload()
    },function(err){
        loading.close()
        console.log(err)
    })
});
//格式化悬赏类型
function formatRewardType(type) {
    switch (type) {
        case 'A':
            return '个股诊断';
        case 'B':
            return '季度策略';
        case 'C':
            return '解套策略';
        case 'D':
            return '年度策略';
    }
}
$(document).on('click', '.reward-list', function() {
    var localUserId = G.getCookie('sdk_user_id');
    var userId = $(this).data('user');
    var rewardId = $(this).data('id');
    if (!localUserId) {
        location.href = '/m/login.html?from=user';
        return;
    }
    if (localUserId != userId) {
        alert('无法查看他人的悬赏')
        return;
    }
    G.setCookie('localUserId', localUserId, 60 * 24)
    location.href = '/m/reward-detail.html?rewardId=' + rewardId + '&localUserId=' + localUserId
})
</script>

</html>